<template>
  <div class="content">
      <div class="login-box">
        <h1 class="title">数据分析与管理系统</h1>
        <h3>管理员名:</h3>     
        <el-input class="user_name" v-model="manager_name"></el-input>

        <h3>密码:</h3>
        <el-input show-password v-model="password"></el-input> 

        <div class="btns"> 
            <el-button class="login" @click="login" type="success">登录</el-button>
        </div>                 
      </div>

  </div>
</template>

<script>
    
  export default{
      data(){
          return {
              manager_name:"",
              password:"",

          }
      },

      mounted:function(){

      },
      methods:{
          login(){
            // this.$router.push({path:'/index'})
            this.$ajax({
                method: 'post',
                url: 'manager_login',
                data: {
                    "manager_name":this.manager_name,
                    "password":this.password,
                }
            }).
            then(res => {

                if(res.data.status==2){
                    this.$message({
                        type: 'success',
                        message: '登录成功'
                    });
                    this.$store.commit('setLoginedManagerName',this.manager_name);
                    this.$store.commit('setLoginedManagerPassword',this.password);
                    this.$router.push({path:'/index/notice'})
                }else{
                    this.$message({
                        type: 'error',
                        message: res.data.res_msg
                    });                      
                }
                
            });               
              
          },

        //   findPwd(){
        //     this.$prompt('请输入邮箱', '提示', {
        //     confirmButtonText: '确定',
        //     cancelButtonText: '取消',
        //     }).then(({ value }) => {
        //     //这里连后端
        //     this.$message({
        //         type: 'success',
        //         message: '密码已发送到邮箱！'
        //     });                       


        //     }).catch(() => {
        //     this.$message({
        //         type: 'info',
        //         message: '取消输入'
        //     });       
        //     });
        //   },

      },

  }
</script>


<style lang="scss" scoped>
    .content{
        width: 100%;
        min-height: 100vh;
        background: url('../../imgs/login-bg.png');
    }
    .user_name{
        margin-bottom: 5%;
    }
    .title{
        text-align: center;
    }
    .login-box{
        padding: 2%;
        border-radius: 10px;
        position: absolute;
        top:30%;
        left: 35%;
        background: rgba(255, 255, 255, 0.5);
        width: 30%;
        height: 300px;
    }
    .login-box h3{
        color: #555;
        margin-bottom: 2%;
    }
    .btns{
        width: 100%;
        margin-top:5%;

    }
    .login{
        width: 30%;
        font-size: 18px;
        margin-left: 35%;
        text-align: center;
    }
    .other-login{
        margin-top:-5%;
        margin-left: 85%;        
    }
    .find-pwd{

        margin-top: 2%;
        margin-left: 85%;
    }
    .find-pwd button{
        cursor:pointer;
        background: rgba(255, 255, 255, 0);
        border: 0;
    }
    .other-login button{
        cursor:pointer;        
        background: rgba(255, 255, 255, 0);
        border: 0;
    }
</style>
